<template>
	<view>
		<!-- 头部 -->
		<uni-nav-bar 
		 leftWidth='200rpx' rightWidth='200rpx'
		 white left-icon="left" leftText="返回" title="忘记密码" />
		<!-- 修改手机号 修改密码 -->
		<view class="amend">
			<!-- 修改手机号 -->
			<view class="amend_tel">
				<view class="tel_box">
					<i class="iconfont icon-dianhua2 tels"></i>
				</view>
				<view class="txt">
					<input type="text" placeholder="请输入手机号" />
				</view>
			</view>
			<!-- 验证码 -->
			<view class="auth_code">
				<view class="auth_num">
					<i class="iconfont icon-suo1 nums"></i>
				</view>
				<view class="auth_number">
					<input type="text" placeholder="请输入验证码" />
				</view>
				<view class="account">
					获取验证码
				</view>
			</view>

			<!-- 密码 -->
			<view class="pwd_box">
				<view class="amend_pwd">
					<i class="iconfont icon-suo1 con"></i>
				</view>
				<view class="pwd">
					<input type="text" placeholder="请输入6-12位验证码" />
				</view>
				<view class="easy">
					<i class="iconfont icon-yanjing jing"></i>
				</view>
			</view>
		</view>
		<!-- 清除缓存 当前版本 -->

		<button type="primary">下一步</button>
	</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	/* @import url('/iconfont/iconfont.css'); */

	page {
		width: 100%;
		height: 100vh;
		background-color: #efefef;
	}

	/* 头部 */

	/deep/.uni-navbar__content {
		border: none;
	}

	/deep/.uni-navbar-btn-text span {
		font-size: 20rpx !important;
	}

	/deep/.uni-nav-bar-text {
		font-size: 25rpx !important;
	}

	/* 修改手机号 修改密码 */
	.amend {
		height: 100%;
		background-color: white;
	}

	.amend_tel {
		width: 100%;
		height: 95rpx;
		margin-left: 10rpx;
		border-bottom: 1px solid #efefef;
		display: flex;
	}

	.tel_box {
		height: 95rpx;
	}

	.tel_box i {
		font-size: 30rpx;
		color: #d17e6a;
		height: 95rpx;
		line-height: 95rpx;
		padding-left: 20rpx;
	}

	.tel_box .tels {
		font-size: 30rpx;
	}

	.txt {
		height: 95rpx;
		width: 100%;
	}

	.txt input {
		height: 95rpx;
		font-size: 25rpx;
		padding-left: 20rpx;
	}



	.auth_code {
		height: 95rpx;
		margin: 0 10rpx;
		border-bottom: 1px solid #efefef;
		display: flex;

	}

	.auth_num {
		height: 95rpx;
	}

	.auth_num i {
		font-size: 30rpx;
		color: #d17e6a;
		height: 95rpx;
		line-height: 95rpx;
		padding-left: 20rpx;
	}

	.auth_num .nums {
		font-size: 30rpx;
	}

	.auth_number {
		height: 95rpx;
		width: 100%;
	}

	.auth_number input {
		height: 95rpx;
		font-size: 25rpx;
		padding-left: 20rpx;
	}

	.account {
		width: 180rpx;
		height: 95rpx;
		color: #4c9fec;
		font-size: 20rpx;
		line-height: 95rpx;
		
	}

	.pwd_box {
		width: 100%;
		height: 95rpx;
		margin-left: 10rpx;
		border-bottom: 1px solid #efefef;
		display: flex;

	}

	.amend_pwd {
		height: 95rpx;
	}

	.amend_pwd i {
		font-size: 30rpx;
		color: #34cb66;
		height: 95rpx;
		line-height: 95rpx;
		padding-left: 20rpx;
	}

	.amend_pwd .con {
		font-size: 30rpx;
	}

	.pwd {
		height: 95rpx;
		width: 100%;
	}

	.pwd input {
		height: 95rpx;
		font-size: 25rpx;
		padding-left: 20rpx;
	}

	.easy {
		height: 95rpx;
		font-size: 25rpx;
		line-height: 95rpx;
		padding-right: 50rpx;
	}

	.easy .jing {
		font-size: 25rpx;
	}


	button {
		width: 515rpx;
		height: 75rpx;
		color: white;
		background-color: #5da5f1;
		border-radius: 50rpx;
		line-height: 75rpx;
		margin-top: 120rpx;
	}
</style>